@homeColor: #FA3F3F;
@fontColor: #999999;
@color333: #333;
@colorfff: #fff;
@colorF46C53: #F46C53;
@colorFF6262: #FF6262;
@colorF4F4F4: #F5F5F5;
@font20: 20rpx;
@font22: 22rpx;
@font24: 24rpx;
@font26: 26rpx;
@font28: 28rpx;
@font30: 30rpx;
@font34: 34rpx;
@font36: 36rpx;



input:disabled {
    color: #333;
}

page {
    height: 100%;
    box-sizing: border-box;
}

.video-player>div {
    height: 100% !important;
}

view {
    box-sizing: border-box;
}

.customNav {
    // 自定义导航栏 paddingtop 混入样式类
    padding-top: 100rpx;
    /*  #ifdef  APP-PLUS  */
    padding-top: calc(100rpx + var(--status-bar-height));
    /*  #endif  */
}

.color {
    color: @homeColor;
}

.item-active-hover {
    // 按键点击效果
    background: transparent !important;
    opacity: 0.5;
}

.bg-hover {
    background: #f4f4f4;
}

.no-more {
    height: 98rpx;
    line-height: 98rpx;
    text-align: center;
    color: #999;
}


.click-active-bgc {
    // 按键点击效果
    background: rgba(0, 0, 0, 0.1) !important;
    // opacity: 0.5;
}

.input-placeholder {
    // 所有输入框 占位符字体大小颜色
    /* placeholder颜色  */
    color: @fontColor;
    /* placeholder字体大小  */
    font-size: @font28 !important;
}

.body-color {
    //  主题色变换类
    @homeColor: #fff !important;

}


.flex {
    display: flex;
}

.flex-align {
    display: flex;
    align-items: center;
}

.flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.flex1 {
    flex: 1;
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    line-height: 1.2;
    text-overflow: ellipsis;
}

.index_class {
    padding: 0 !important;
    background-color: @colorF4F4F4;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

        //  所有自定义导航栏样式
    .status {
        width: 100%;
        height: 0;
        /*  #ifdef  APP-PLUS  */
        height: var(--status-bar-height) !important;
        /*  #endif  */
        background: @homeColor !important;
        position: fixed;
        top: 0;
        z-index: 999;
    }

    .status-active {
        width: 100%;
        height: 0;
        /*  #ifdef  APP-PLUS  */
        height: var(--status-bar-height);
        /*  #endif  */
    }

    .to-tltle {
        position: relative;
        .place;
        color: @colorfff;
        text-align: center;
        line-height: 44px;
        font-size: @font34;
        width: 100%;

        .delete {
            position: absolute;
            top: 50%;
            right: 20rpx;
            transform: translateY(-50%);
            font-size: @font30;
        }

        .back {
            position: absolute;
            top: 50%;
            left: 0rpx;
            transform: translateY(-50%);
            padding: 30rpx;
        }

        .shear {
            position: absolute;
            top: 50%;
            right: 0rpx;
            transform: translateY(-50%);
            padding: 30rpx;
        }
    }


    //   首页样式 模块
    .place {
        /*  #ifdef  APP-PLUS  */
        margin-top: var(--status-bar-height);
        /*  #endif  */
        background-color: @homeColor;
        height: 44px;
    }

    .header {
        width: 100%;
        height: 100rpx;
        background-color: @homeColor;
        display: flex;
        position: fixed;
        top: 0;
        /*  #ifdef  APP-PLUS  */
        top: var(--status-bar-height);
        /*  #endif  */
        align-items: center;
        z-index: 996;

        .scan {
            width: 100rpx;
            height: 100rpx;
            flex-shrink: 1;
            display: flex;
            justify-content: center;
            align-items: center;

            .icon_e64c {
                color: @colorfff;
                font-size: 45rpx;
            }

            .icon_e675 {
                color: @colorfff;
            }
        }

        .input {
            width: calc(100% - 130rpx);
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
            background-color: @colorfff;
            border-radius: 30rpx;

            // margin-right: 30rpx;
            input {
                width: calc(100% - 60rpx);
                height: 60rpx;
                background-color: @colorfff;
                // padding-left: 60rpx;
                font-size: @font24;
                color: @fontColor;
                box-sizing: border-box;
            }

            .icon {
                width: 70rpx;
                height: 60rpx;
                color: #a18090;
                z-index: 996;
                font-size: 40rpx;
                display: flex;
                justify-content: center;
                align-items: center;
            }

            .search {
                width: 120rpx;
                height: 60rpx;
                display: flex;
                justify-content: center;
                align-items: center;
                background-color: #F9F9F9;
                font-size: @font28;
                color: @color333;
                border-radius: 0 30rpx 30rpx 0;
            }
        }
    }

    .bu_class {
        box-sizing: border-box;
        display: flex;
        flex-wrap: wrap;
        .bu_items {
            width: 20%;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            margin-top:20rpx;


            image {
                height: 84rpx;
                width: 84rpx;
            }

            view {
                width: 100%;
                display: block;
                text-align: center;
                font-size: 28rpx;
                color: #666;
                padding: 6rpx 0 0 0;
            }
        }

    }

    .shop {
        .shop_banner_img {
            width: 100%;
            height: 310rpx;
            display: block;
        }

        .shop_banner {
            // padding: 0 0rpx 34rpx 0rpx;
            display: flex;

            .shop_left {
                width: 296rpx;
                height: 380rpx;
            }

            .shop_right {
                flex: 1;

                image {
                    display: block;
                    height: 50%;
                    width: 100%;
                }
            }
        }

        .shop_bottom {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 20rpx;
            padding: 20rpx 30rpx;
            border-top: 1rpx solid @colorF4F4F4;

            .shop_time {
                display: flex;
                align-items: center;

                image {
                    height: 35rpx;
                    width: 114rpx;
                }

                .countd {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    font-size: @font22;
                    background-color: @colorFF6262 ;
                    color: @colorfff;
                    padding: 0 10rpx;
                    border-radius: 6rpx;
                    margin-left: 20rpx;
                    height: 36rpx;
                    overflow: hidden;

                    text {
                        margin-right: 10rpx;
                    }

                    .grace-countdown {
                        height: 36rpx;

                        view {
                            height: 36rpx;
                            line-height: 36rpx;
                            border: 0;
                            padding: 0;
                            margin: 0;
                            background-color: @colorFF6262!important ;
                            color: @colorfff;
                        }
                    }
                }

            }

            .shop_all {
                color: @color333;
                font-size: @font26;

                text {
                    color: @color333;
                    font-size: @font26;
                }

            }
        }
    }
.cardTit{
    margin:10rpx 35rpx;
    color:#444;
    display:flex;
    align-items:center;
    .cardTitbadge{
        background-color: #ff4444;
        color: #fff;
        font-size: 10px;
        display: inline-flex;
        align-items: center;
        height: 32rpx;
        font-weight:normal;
        border-radius: 6rpx;
        margin-left:10rpx;
        padding: 2rpx 8rpx;
        border-top-right-radius: 14rpx;
        border-bottom-left-radius: 14rpx;
    }
}
.cardTab{
    margin:10rpx 16rpx;
    color:#444;
    display:flex;
    align-items:center;
	text-align: center;
	background-image: linear-gradient(180deg, #fceded, #fff 20%);
	padding:10rpx 0;
	border-radius: 20rpx;
	.cardTitTab{
		margin-right:40rpx;
		width:160rpx;
		.cardTitbadgeTab{
			font-size: 25rpx;
			padding:5rpx 0;
			color: #999;
		}
		.cardBorder{
			margin:0 auto;
			width:80rpx;
			height:6rpx;
			background: #f00;
		}
	}
}


    .r_title {
        display: flex;
        align-items: center;
        height: 100rpx;
        border-bottom: 1rpx solid @colorF4F4F4;

        .iconfont {
            color: @color333;
            margin-right: 8rpx;
            display: block;
        }

        text {
            font-size: @font34;
            font-weight: 600;
            color: @color333;

        }
    }

    //   商品列表
    .r-list {
        display: flex;
        justify-content: space-between;
        background-color: @colorF4F4F4;
        flex-wrap: wrap;
        padding: 0 20rpx;

        .r-items {
            display: flex;
            flex-direction: column;
            width: 350rpx;
            padding-bottom: 24rpx;
            position: relative;
            overflow: hidden;
            margin-bottom: 24rpx;
            box-sizing: border-box;
            border-radius: 20rpx;
            background: #fff;

            image {
                width: 350rpx;
                height: 350rpx;
            }

            .r-items__content {
              background: #fff;
            }

            .r-bottom__container {
              padding: 0 24rpx;
            }

            &>text {
                display: block;
                width: 100%;
                color: #333;
                font-size: 28rpx;
                text-align: center;
                padding: 10rpx 39rpx 14rpx 24rpx;
                box-sizing: border-box;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .r-bottom {
                display: flex;
                align-items: center;

                image {
                    width: 45rpx;
                    height: 35rpx;
                    padding-left: 24rpx;
                }

                text {
                    display: block;
                    width: 59rpx;
                    height: 29rpx;
                    line-height: 29rpx;
                    text-align: center;
                    margin-left: 8rpx;
                    border-radius: 4rpx;
                    border: 1rpx solid @homeColor;
                    font-size: 20rpx;
                    color: @homeColor;
                }
            }

            .r-money {
                display: flex;
                align-items: center;
                width: 100%;

                text {
                    font-size: @font34;
                    color: @homeColor;
                }

                i {
                    color: #999;
                    font-size: 22rpx;
                    padding-left: 8rpx;
                }
            }

            .posit-left {
                position: absolute;
                left: 0;
                top: 0;
                height: 101rpx;
                width: 104rpx;
                z-index: 9;
                color: #fff;

                image {
                    width: 100%;
                    height: 100%;
                }

                text {
                    position: absolute;
                    top: 40%;
                    left: 50%;
                    width: 100%;
                    transform: translate(-50%, -50%);
                    text-align: center;
                }
            }
        }
    }



    // 附近商家模块样式
    .header-filter {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 88rpx;
        padding: 0 63rpx;
        background-color: @colorfff;
        position: relative;
        border-top: none;
        border-bottom: 1rpx solid @colorF4F4F4;

        .items {
            height: 100%;
            line-height: 88rpx;
            text-align: center;
            border-bottom: 1rpx solid transparent;

            &.filter-active {
                border-bottom: 1rpx solid @homeColor;
                color: @homeColor;
            }
        }

        // 下拉选项
        .filter-options {
            background-color: @colorfff;
            width: 100%;
            position: absolute;
            top: 88rpx;
            left: 0;
            box-shadow: 0px 5px 6px rgba(0, 0, 0, 0.16);

            .options-itens {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 0 63rpx;
                height: 98rpx;
                line-height: 98rpx;

                &.options-active {

                    text,
                    i {
                        color: @colorFF6262;
                    }

                }
            }
        }

        .money_al {
            display: flex;
            align-items: center;
        }

        .over {
            display: flex;
            flex-direction: column;

            align-items: center;
        }

        .over i {
            color: #999;
        }

        .ac-color {
            color: #FA3F3F !important;
        }


    }

    .bus-top {
  //       position: fixed;
		// top: 80rpx;
        width: 100%;
        background-color: @colorF4F4F4;
        z-index: 999;

        .bus-title-search {
            height: 103rpx;
            width: 100%;
            background-color: @colorfff;
            display: flex;
            align-items: center;
            justify-content: center;
            border-bottom: 1rpx solid @colorF4F4F4;

            .bus-search {
                width: calc(100% - 60rpx);
                display: flex;
                align-items: center;
                justify-content: center;
                border: 2rpx solid @homeColor;
                border-radius: 32rpx;

                .icon {
                    width: 70rpx;
                    height: 60rpx;
                    color: #a18090;
                    z-index: 996;
                    font-size: 40rpx;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }

                input {
                    width: calc(100% - 130rpx);
                    height: 64rpx;
                    font-size: @font24;
                }

                .bus-tap {
                    width: 130rpx;
                    height: 64rpx;
                    line-height: 64rpx;
                    text-align: center;
                    font-size: @font28;
                    color: @colorfff;
                    background-color: @homeColor;
                    border-radius: 0 30rpx 30rpx 0;

                }
            }

        }



    }

    .filter-scroll {
        background-color: @colorfff;
        padding-top: 291rpx;

        .scroll-title {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 80rpx;
            font-size: @font34;
            color: @colorFF6262;
            border-top: 1rpx solid @colorF4F4F4;

            i {
                margin-right: 8rpx;
            }
        }

        .scroll-items {
            border-bottom: 1rpx solid @colorF4F4F4;

            .item-top {
                display: flex;
                padding: 20rpx 0 0 30rpx;

                .img {
                    width: 288rpx;
                    height: 188rpx;
                    background-color: #eee;
                    border-radius: 10rpx;
                }

                .text {
                    padding: 0 45rpx 0 20rpx;

                    view {
                        color: @fontColor;
                        font-size: @font28
                    }

                    .title {
                        font-size: @font30;
                        color: @color333;
                    }
                }

            }

            .item-bottom {
                height: 88rpx;
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 0 214rpx;

                .bgc {
                    width: 2rpx;
                    height: 50%;
                    background-color: @colorF4F4F4;
                }

                .img {
                    height: 54rpx;
                    width: 54rpx;
                }
            }
        }

    }

    // 暂无商家
    .depot {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        image {
            width: 558rpx;
            height: 365rpx;
        }

        view {
            font-size: @font34;
        }

        .tps {
            font-size: @font26;
            color: @fontColor;
        }

        .stroll {
            width: 228rpx;
            height: 72rpx;
            line-height: 72rpx;
            text-align: center;
            border-radius: 36rpx;
            background-color: @homeColor;
            color: @colorfff;
            margin-top: 95rpx;
        }

    }



    // 购物车模块样式
    .cart_top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20rpx 20rpx 10rpx 22rpx;

        .cart_title {
            display: flex;
            align-items: center;

            text {
                padding-left: 8rpx;
                font-size: 32rpx;
            }

        }
    }

    .grace-shoppingcard {
        margin: 0;
        width: 100%;
        border-radius:16rpx
    }

    .grace_class {
        background-color: @colorfff;
        box-sizing: border-box;
        border-radius:18rpx;
        margin:14rpx 18rpx;
    }

    .cart-scoll {
        width: 100%;
        padding-bottom: 90rpx;

        .grace_discount {
            padding: 20rpx 30rpx;

            >view {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                font-size: @font26;
                color: @homeColor;

                &:nth-child(1) {
                    margin-bottom: 10rpx;
                }

                .infos_name {
                    font-size: @font20;
                    border: 1rpx solid @homeColor;
                    border-radius: 5rpx;
                    width: 80rpx;
                    text-align: center;
                    padding: 0;
                    margin-right: 20rpx;


                }
            }

            .infos_list {
                font-size: @font26;
            }
        }
    }

    .goods-title {
        .to_text {
            // width: 90rpx;
            margin-top: 5rpx;
            // height: 32rpx;
            // line-height: 32rpx;
            background-color: @colorfff;
            color: @fontColor;
            font-size: 22rpx;
            // text-align: center;
            border-radius: 8rpx;
        }

        .to_name {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

    }

    .desc {
        width: 60% !important;
    }

    .grace-shoppingcard .goods image {
        width: 175rpx;
        height: 175rpx;
    }

    .grace-shoppingcard .goods .goods-price {
        width: 100% !important;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 0 !important;
    }

    .grace-shoppingcard .goods {
        align-items: center;
        margin: 0 !important;

    }

    .icon_e632,
    .icon_e741 {
        text-align: center;
        color: #c3c7ca;
        padding: 0 20rpx 0 8rpx;
        font-size: 32rpx;
    }
    .icon_e632{
        color:#ff6262;
    }
.icon_e60c{
    color:#f5f5f5
}

    .grace-footer {
        align-items: center;
        padding-left: 18rpx;

        .clickBgc {
            background-color: @homeColor;
        }
    }

    // 个人中心模块

    .per-lists {
        margin-top: 20rpx;
        background-color: @colorfff;

        .items {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding:  30rpx;

            border-bottom: 1rpx solid @colorF4F4F4;

            >view {
                font-size: @font28;
                display: flex;
                align-items: center;
                // flex-direction: column;
            }
        }
    }


    // 直播
    .live-header {
        position: fixed;
        width: 100%;
        background-color: @colorF4F4F4;
        z-index: 99999;

        .live-title {
            display: flex;
            align-items: center;
            position: relative;
            width: 100%;
            line-height: 55px;
            .place;
            color: @colorfff;
            text-align: center;
            font-size: @font34;

            .live-title__search {
                display: flex;
                align-items: center;
                width: 474rpx;
                height: 60rpx;
                margin-left: 93rpx;
                padding-left: 29rpx;
                background: rgba(255, 117, 98, 0.5);
                border-radius: 30rpx;

                .search-text {
                    flex: 1;
                    text-align: left;
                    padding-left: 9px;
                }

                .search-btn {
                    width: 101rpx;
                    height: 60rpx;
                    line-height: 60rpx;
                    background: rgba(244, 146, 122, 0.3);
                    text-align: center;
                    color: #fff;
                    font-size: 28rpx;
                    border-radius: 0 30rpx 30rpx 0;
                }
            }

            .live-title__right {
                position: absolute;
                top: 50%;
                right: 40rpx;
                height: 60rpx;
                line-height: 60rpx;
                transform: translateY(-50%);
                font-size: 28rpx;
                color: #fff;
            }
        }
    }

    .live-swiper {
        height: 280rpx;

        image {
            display: block;
            width: 96%;
            height: 280rpx;
            border-radius: 10rpx;
        }
    }

    .live-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: 82rpx;
        padding: 0 24rpx;
        color: @fontColor;
        font-size: @font26;

        .live-title__left {
            display: flex;
            align-items: flex-end;

            view {
                color: @color333;
                font-size: @font34;
                margin-right: 20rpx;
            }
        }
    }

    .live-ranklist {

        .live-ranklist__wrap {
            white-space: nowrap;
            height: 220rpx;

            .live-ranklist__item {
                display: inline-block;
                position: relative;
                width: 220rpx;
                height: 220rpx;
                margin-right: 16rpx;

                &:first-child {
                    margin-left: 24rpx;
                }

                &:last-child {
                    margin-right: 24rpx;
                }

                &>image {
                    position: absolute;
                    left: 0;
                    top: 0;
                    width: 220rpx;
                    height: 220rpx;
                }

                .live-ranklist__item--top {
                    position: absolute;
                    left: 6rpx;
                    top: 10rpx;
                    z-index: 1;
                    width: 100rpx;
                    height: 35rpx;
                    text-align: center;
                    line-height: 35rpx;
                    font-size: 20rpx;
                    color: #fff;
                    background: rgba(255, 54, 87, 1);
                    border-radius: 18rpx;
                }

                .live-ranklist__item--bottom {
                    display: flex;
                    align-items: center;
                    position: absolute;
                    z-index: 1;
                    bottom: 10rpx;
                    left: 11rpx;
                    height: 33rpx;
                    padding: 0 11rpx;
                    font-size: 22rpx;
                    color: #fff;
                    background: rgba(0, 0, 0, 0.2);
                    border-radius: 17rpx;
                    border: 1rpx solid rgba(255, 255, 255, 1);


                    image {
                        width: 16rpx;
                        height: 19rpx;
                        margin-right: 7rpx;
                    }
                }
            }
        }
    }


        .live-item__title {
            white-space: nowrap;
            height: 92rpx;
            line-height: 92rpx;
                .active{
                    color:#fa3e3f;
                }
            .active:after {

                background: linear-gradient(to right, #ffa468, #fa3f3f);
            }

            view {
                display: inline-block;
                position: relative;
                margin-right: 49rpx;
                font-size: 32rpx;
                color: @color333;
                font-weight:600;
                &:after {
                    position: absolute;
                    bottom: -6rpx;
                    left: 50%;
                    width: 80%;
                    height: 8rpx;
                    border-radius:100px;
                    background: transparent;
                    transform: translateX(-50%);
                    content: ' ';
                }

                &:first-child {
                    margin-left: 24rpx;
                }

                &:last-child {
                    margin-right: 24rpx;
                }
            }
        }




    .personal {

        .per-head {
            position: relative;
            height: 380rpx;
            width: 100%;
            background-color: @homeColor;

            >image {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
            }

            .per-data {
                position: absolute;
                bottom: 79rpx;
                left: 0;
                display: flex;
                align-items: center;
                justify-content: space-between;
                width: 100%;
                padding: 0 30rpx;

                .per-left {
                    display: flex;
                    align-items: center;

                    >image {
                        width: 155rpx;
                        height: 155rpx;
                        border-radius: 50%;

                    }

                    view {
                        font-size: @font36;
                        margin-left: 30rpx;
                        color: @colorfff;

                        image {
                            width: 45rpx;
                            height: 35rpx;
                            margin-left: 15rpx;
                        }
                    }
                }

                .login_right {
                    width: 152rpx;
                    height: 52rpx;
                    line-height: 52rpx;
                    text-align: center;
                    font-size: @font28;
                    color: #947700;
                    border-radius: 22rpx;
                    background-color: #FFD21E;
                }
            }

            .per-icon {
                position: absolute;
                top: 40rpx;
                right: 0rpx;
                padding: 30rpx;
                font-size: 40rpx;
                color: @colorfff;
            }
        }

        .per-number {
            position: relative;
            height: 129rpx;
            width: 100%;
            padding: 0 30rpx;
            background-color: @colorfff;

            .per-position {
                display: flex;
                align-items: center;
                justify-content: space-between;
                width: 700rpx;
                position: absolute;
                left: 50%;
                top: -54rpx;
                transform: translateX(-50%);
                height: 143rpx;
                background-color: @colorfff;
                box-shadow: 0px 4px 6px 0px rgba(108, 108, 108, 0.07);
                border-radius: 10rpx;

                >view {
                    text-align: center;
                    flex: 1;
                    position: relative;

                    &:nth-child(2)::before {
                        position: absolute;
                        // content: "";
                        width: 2rpx;
                        height: 59rpx;
                        background-color: @colorF4F4F4;
                        left: 0;
                        top: 50%;
                        transform: translateY(-50%);
                    }

                    >view {
                        font-size: @font30;
                        line-height: 50rpx;
                    }
                }
            }
        }

        .mywallet {
            background-color: @colorfff;
            margin-top: 20rpx;
            padding-bottom: 30rpx;

            .wall-title {
                height: 88rpx;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 0 30rpx;

                view {
                    font-size: @font30;
                }

                .ti-right {
                    font-size: @font26;
                    color: @fontColor;
                }
            }

            .wall-info {
                height: 115rpx;
                border-bottom: 1rpx solid @colorF4F4F4;

                >view {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    padding: 8rpx 0;

                    &:nth-child(1) text {
                        font-size: @font30;
                        color: @homeColor;
                    }

                    text {
                        flex: 1;
                        text-align: center;
                        font-size: @font28;
                    }
                }
            }

            .myorder {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 0 30rpx;

                >view {
                    flex: 1;
                    text-align: center;
                    font-size: @font26;
                    position: relative;

                    >image {
                        width: 60rpx;
                        height: 60rpx;
                        margin-bottom: 15rpx;
                    }
                }

            }
        }

        .per-lists {
            .per-lists;
        }
    }

    .badeg {
        position: absolute;
        top: 0rpx;
        right: 30rpx;
        width: 35rpx;
        height: 35rpx;
        line-height: 35rpx;
        text-align: center;
        border-radius: 50%;
        background-color: @colorFF6262;
        color: @colorfff;
        font-size: @font22 !important;
    }

    // 发现模块样式
    .conversation {
        height: 100%;
        background-color: @colorF4F4F4;

        .con-title {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 30rpx;
            height: 80rpx;
            line-height: 80rpx;
            background-color: @colorfff;

            view {
                font-size: @font34;
                display: flex;
                align-items: center;

                image {
                    width: 35rpx;
                    height: 40rpx;
                    margin-right: 8rpx;
                }
            }
        }

        .img-scoll {
            width: 100%;
            background-color: @colorfff;

            .scroll-view_H {
                white-space: nowrap;
                padding: 0 30rpx 40rpx 30rpx;
                box-sizing: border-box;

                view {
                    display: inline-block;
                    margin-right: 20rpx;
                    //    background: rgba(0,0,0,0.3);
                    border-radius: 5rpx;
                    position: relative;

                    &:last-child {
                        margin-right: 0rpx;
                    }

                    .img-text {
                        display: block;
                        position: absolute;
                        top: 50%;
                        left: 50%;
                        transform: translate(-50%, -50%);
                        width: 100rpx;
                        white-space: normal;
                        word-break: break-all;
                        word-wrap: break-word;
                        color: @colorfff;

                        overflow: hidden;
                        text-overflow: ellipsis;
                        display: -webkit-box;
                        -webkit-line-clamp: 2;
                        -webkit-box-orient: vertical;
                    }
                }
            }

            .scoll-items {
                width: 175rpx;
                height: 175rpx;
            }

        }

        .seg-tab {
            background-color: @colorfff;
            width: 100%;
            height: 98rpx;
            margin-top: 20rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 198rpx;
            border-bottom: 1rpx solid @colorF4F4F4;

            view {
                font-size: @font30;
                padding: 10rpx 10rpx;
                color: @fontColor;

                &.active {
                    border-bottom: 4rpx solid @homeColor;
                    color: @color333;
                }
            }
        }

        .seg-mend {
            background-color: @colorfff;
            padding: 0 30rpx;
            margin-bottom: 20rpx;

            .seg-h {
                display: flex;
                align-items: center;
                justify-content: space-between;
                height: 98rpx;
            }

            .seg-text {
                padding: 15rpx 0;
                font-size: @font28;
            }

            .seg-img {
                display: flex;
                //    justify-content: space-between;
                align-items: center;
                flex-wrap: wrap;

                image {
                    width: 226rpx;
                    height: 226rpx;
                    display: inline-block;

                    margin: 0 7rpx 10rpx 0;

                    &:nth-child(3n+0) {
                        margin-right: 0;
                    }

                }
            }

            .seg-bottom {
                display: flex;
                justify-content: space-between;
                align-items: center;
                background-color: @colorF4F4F4;
                margin-top: 10rpx;
                padding: 20rpx;

                image {
                    width: 91rpx;
                    height: 91rpx;
                    margin-right: 20rpx;
                }

                text {
                    flex: 1;
                    color: @color333;
                    font-size: @font30;
                    font-weight: 700;
                }
            }

            .download {
                display: flex;
                justify-content: space-between;
                align-items: center;
                height: 80rpx;
                margin-top: 18rpx;

                .download-item {
                    width: 33.333%;
                    text-align: center;
                    font-size: @font26;
                    position: relative;
                    color: @color333;

                    &:nth-child(2)::before,
                    &:nth-child(3)::before {
                        content: '';
                        display: block;
                        width: 1rpx;
                        height: 60%;
                        background-color: @color333;
                        position: absolute;
                        left: 0;
                        top: 50%;
                        transform: translateY(-50%);
                    }
                }
            }
        }
    }

    // #捕手说#    我的关注公共混入样式
    .seg-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 30rpx;

        .seg-left {
            display: flex;
            justify-content: space-between;
            align-items: center;

            text {
                font-size: @font34;
                color: @color333;
                display: block;
            }

            .datatime {
                font-size: @font26;
                color: @fontColor;
            }

            image {
                width: 105rpx;
                height: 105rpx;
                border-radius: 50%;
                background-color: @homeColor;
                margin-right: 18rpx;
            }
        }

        .follow {
            width: 92rpx;
            height: 42rpx;
            line-height: 42rpx;
            background-color: @homeColor;
            color: @colorfff;
            border-radius: 21rpx;
            text-align: center;
            font-size: @font26;

        }
    }

    .seg-mend {
        background-color: @colorfff;
        padding: 0 30rpx;
        margin-bottom: 20rpx;

        .seg-h {
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 98rpx;
        }

        .seg-text {
            padding: 15rpx 0;
            font-size: @font28;
        }

        .seg-img {
            display: flex;
            //    justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;

            image {
                width: 226rpx;
                height: 226rpx;
                background-color: #eee;
                margin: 0 10rpx 10rpx 0;

                &:nth-child(3n+0) {
                    margin-right: 0;
                }

            }
        }

        .seg-bottom {
            display: flex;
            justify-content: space-between;
            align-items: center;
            background-color: @colorF4F4F4;
            margin-top: 10rpx;
            padding: 20rpx;

            image {
                width: 91rpx;
                height: 91rpx;
                margin-right: 20rpx;
            }

            text {
                flex: 1;
                color: @color333;
                font-size: @font30;
                font-weight: 700;
            }
        }

        .download {
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 80rpx;
            margin-top: 18rpx;

            .download-item {
                width: 33.333%;
                text-align: center;
                font-size: @font26;
                position: relative;

                &:nth-child(2)::before,
                &:nth-child(3)::before {
                    content: '';
                    display: block;
                    width: 1rpx;
                    height: 60%;
                    background-color: @color333;
                    position: absolute;
                    left: 0;
                    top: 50%;
                    transform: translateY(-50%);
                }
            }
        }
    }



    @import url('./squareSon.less'); // 发现模块所有子页面样式
    @import url('./homeSon.less'); // 首页所有子页面样式
    @import url('./personalSon.less'); // 首页所有子页面样式
    @import url('./businexxSon.less'); // 附近商家所有子页面样式


}
